<template>
	<view class="addmedicine-container">
		<h2 style="text-align: center;">添加药品</h2>
		<view class="row">
			<view class="txt">
				药品名称
			</view>
			<input type="text" v-model="formData.name" />
		</view>
		<view class="row">
			<view class="txt">
				食用方法
			</view>
			<input type="text" v-model="formData.dosage" />
		</view>
		<view class="row">
			<view class="txt">
				生产日期
			</view>
			<view class="row">
				<input type="number" v-model="formData.productionYear" />年-
				<input type="number" v-model="formData.productionMonth" />月-
				<input type="number" v-model="formData.productionDay" />日
			</view>
		</view>
		<view class="row">
			<view class="txt">
				保质期
			</view>
			<input type="number" v-model="formData.shelfLife" />月
		</view>
		<view class="row">
			<view class="txt">
				吃药时间
			</view>
			<view class="row">
				<input type="number" v-model="formData.reminderTime.hour" />:
				<input type="number" v-model="formData.reminderTime.minute" />
			</view>
		</view>
		<view class="row-center">
			<view class="btn" @click="cancel">
				取消
			</view>
			<view class="btn" style="background-color: skyblue;" @click="confirmAddMedicine">
				确定
			</view>
		</view>
		<view class="row-center">
			<view class="btn" @click="scanQr">
				扫码识别
			</view>
		</view>
	</view>
</template>

<script setup>
	import { ref } from 'vue';
	import { useUserStore } from '../../store/User';
	const userStore = useUserStore();

	const formData = ref({
		'name': '',
		'dosage': '',
		'reminderTime': {
			'hour': 8,
			'minute': 0
		},
		'productionYear': '',
		'productionMonth': '',
		'productionDay': '',
		'shelfLife': '',
		'categoryId': '',
		'familyId': '',
		'alarmFlag': false
	});


	const cancel = () => {
		uni.navigateBack();
	};

	const scanQr = () => {
		uni.scanCode({
			scanType: ['barCode'],
			success: function(res) {
				const APP_ID = 'hgphqmfrmjqnlqlm';
				const APP_SECRET = 'yb0pKCHpw7yLziRQntt0fmJEG3N4gKmd';
				// console.log('条码类型：' + res.scanType);
				uni.request({
					url: `https://www.mxnzp.com/api/barcode/goods/details?barcode=${res.result}&app_id=${APP_ID}&app_secret=${APP_SECRET}`,
					method: 'GET',
					header: { 'Content-Type': 'application/json' },
					success: response => {
						const {
							goodsName,
							brand
						} = response.data.data;
						formData.value.name = brand + goodsName;
						uni.showToast({
							title: '识别成功',
							icon: 'success'
						});
					},
					fail: error => {
						uni.showToast({
							title: '识别失败',
							icon: 'error'
						});
						console.error(error);
					}
				});
			}
		});
	};

	const confirmAddMedicine = () => {
		// 进行表单验证，所有不可为空
		if (!formData.value.name || !formData.value.productionYear ||
			!formData.value.productionMonth || !formData.value.productionDay ||
			!formData.value.dosage || formData.value.reminderTime.hour.toString().length < 1 ||
			formData.value.reminderTime.minute.toString().length < 1 || !formData.value.shelfLife) {
			uni.showToast({
				title: '所有内容不可为空',
				icon: 'error'
			});
			return;
		}
		// 月份和日期的验证
		if (formData.value.productionMonth < 1 || formData.value.productionMonth > 12) {
			uni.showToast({
				title: '月份不合法',
				icon: 'error'
			});
			return;
		}
		if (formData.value.productionDay < 1 || formData.value.productionDay > 31) {
			uni.showToast({
				title: '日期不合法',
				icon: 'error'
			});
			return;
		}
		// 时分验证
		if (formData.value.reminderTime.hour < 0 || formData.value.reminderTime.hour > 23) {
			uni.showToast({
				title: '小时不合法',
				icon: 'error'
			});
			return;
		}
		if (formData.value.reminderTime.minute < 0 || formData.value.reminderTime.minute > 59) {
			uni.showToast({
				title: '分钟不合法',
				icon: 'error'
			});
			return;
		}
		// 保质期验证
		if (formData.value.shelfLife < 0) {
			uni.showToast({
				title: '保质期不合法',
				icon: 'error'
			});
			return;
		}
		// 处理生产日期
		const productionDate =
			`${formData.value.productionYear}-${formData.value.productionMonth}-${formData.value.productionDay}`;
		// 获取familyId与分类id
		const { familyId } = uni.getStorageSync('userInfo');
		const cate = uni.getStorageSync('cate');
		const cateId = cate[userStore.index].categoryId;
		// 生成新的表单对象
		let obj = {
			...formData.value,
			familyId,
			categoryId: cateId,
			productionDate,
		};
		// 调用云函数
		uniCloud.callFunction({
			name: 'addMedicine',
			data: obj,
			success: response => {
				uni.showToast({
					title: '添加成功',
					icon: 'success'
				});
				uni.switchTab({ url: '/pages/index/index' });
			},
			fail: error => {
				console.error(error);
			}
		});
	};
</script>

<style scoped lang="scss">
	.addmedicine-container {
		display: flex;
		flex-direction: column;
		gap: 60rpx;

		.row {
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: space-between;
			padding: 20rpx;
			box-sizing: border-box;
			height: 130rpx;
			line-height: 180rpx;

			.txt {
				width: 400rpx;
				line-height: 180rpx;
				height: 180rpx;
				font-size: 36rpx;
			}

			input {
				height: 80rpx;
				border: 1rpx solid #ccc;
				border-radius: 10rpx;
				padding: 0 20rpx;
			}
		}

		.row-center {
			display: flex;
			justify-content: space-around;

			.btn {
				width: 300rpx;
				height: 80rpx;
				line-height: 80rpx;
				text-align: center;
				border: 1rpx solid #ccc;
				border-radius: 10rpx;
			}
		}
	}
</style>